<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>登录页面</title>
    <!-- Import style -->
    <link rel="stylesheet" href="./static/element-plus/index.css" />
    <!-- Import Vue 3 -->
    <script src="./static/js/vue.global.js"></script>
    <!-- Import component library -->
    <script src="./static/element-plus/index.full.js"></script>
    <script src="./static/element-plus/theme-chalk/display.css"></script>
</head>
<body>
    <div id="app">
      <el-row>
        <el-col :md="24" :lg="8"></el-col>
        <el-col :md="24" :lg="8">
          <h1>登录</h1>
          <el-form :model="form" label-width="auto" style="max-width: 600px">
            <el-form-item label="用户名">
              <el-input v-model="username" type="text" />
            </el-form-item>
            <el-form-item label="密码">
              <el-input v-model="password" type="password" />
            </el-form-item>
            <el-form-item label="&nbsp;&nbsp;&nbsp;&nbsp;">
              <el-button type="primary" @click="onSubmit">登录</el-button>
            </el-form-item>
          </el-form>
        </el-col>
        <el-col :md="24" :lg="8"></el-col> 
      </el-row>
    </div>
  </body>
  <script>
    var App = {
      data() {
        return {
          username: '',
          password: '',
          age: '',
          gender: '',
          hobby: '',
          occupation: '',
          self_introduction: ''
        }
      }
    }
    Vue.createApp(App).use(ElementPlus).mount('#app')
  </script>
  
  </html>